import * as React from 'react';
import { View, Image, Swiper, SwiperItem } from 'remax/wechat';

import styles from './index.less';

import NavBar from "@/components/navbar";
import Tool from "./tools";
import Ad from "./ad";
import HotSales from "./hot_sales";
import MyItinerary from "./my_itinerary";
import HotBook from "./hot_book";

const index = () => {
  const [list, setList] = React.useState(['https://alipic.lanhuapp.com/SketchPng9f7a08a44e9ac0f71c734eb425876f66051e71ea71b1db3979765916efb8fd2a']);

  return <View className={styles.home}>
    <NavBar title="8° ~ 12° 晴 西江" />
    <View className="relative">
      <Swiper className={styles.banner} indicatorDots autoplay circular>
        {
          list.map((item, index) => {
            return <SwiperItem key={index} style={{ zIndex: 1 }}>
              <View className={styles.banner_image}>
                <Image className={styles.banner_image} lazyLoad src={item} />
              </View>
            </SwiperItem>
          })
        }
      </Swiper>
      <View className={styles.banner_insert}></View>
    </View>
    <View className={styles.list}>
      <Tool />
      <Ad />
      <HotSales />
      <MyItinerary />
      <HotBook />
    </View>
  </View>
}

export default index;